<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Div布局</title>
  <style type="text/css">
  body{
    margin:0px;
  }
  #container{
    width:100%;
    height:1000px;
    background-color: darkgrey;
  }
  #heading{
    width:100%;
    height:100px;
    background-color: darkkhaki;
  }
  #container_meau{
    width:30%;
    height:800px;
    float:left;
    background-color: darkolivegreen;
  }
  #container_body{
    width:70%;
    height:800px;
    float:left;
    background-color: darkorchid;
  }
 #footing{
   width:100%;
   height:100px;
   clear:both;
   background: darkseagreen;
 }
  </style>
</head>
<body>
  <div id="container">
    <div id="heading">头部</div>
    <div id="container_meau">内容菜单</div>
    <div id="container_body">内容主体</div>
    <div id="footing">底部</div>
  </div>
</body>
</html>